<template>
  <div class="Authorization">
    <div class="but">
      <el-button type="primary" size="small" :disabled="tablerow.defaultMenu" @click="give(true)">组织授权</el-button>
      <el-button type="primary" size="small" :disabled="tablerow.defaultMenu" @click="give(false)">人员授权</el-button>
    </div>
    <div class="table">
        <TableColumn
          ref="tabledata"
          :tableData="authoritylist" 
          :tableConfig="tableConfig">
          <el-table-column
              prop="address"
              label="操作"
              align="center">
              <template #default="{row}">
                <el-link type="primary" :underline="false" @click="dellist(row)">删除</el-link>
              </template>
          </el-table-column>
        </TableColumn>
    </div>
    <div>
      <el-dialog :title="isuser?'组织授权':'人员授权'" :visible.sync="dialogVisible" width="40%" >
          <div>
            <userTree v-if="!isuser" @changetype="changetype" :dialogVisible="dialogVisible"></userTree>
            <orgTree v-else @changetype="changetype" :dialogVisible="dialogVisible"></orgTree>
          </div>
          <div slot="footer">
              <el-button type="primary" size="small" @click="sure">确 定</el-button>
              <el-button @click="dialogVisible = false" size="small">取 消</el-button>
          </div>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import orgTree from './tree/orgTree.vue'
import userTree from './tree/userTree.vue'
import {getMenuGrantListapi,postgrantorganizationapi,postgrantuserapi,deletegrantorganizationapi} from '@/api/system/menu-manage'
import TableColumn from '@/components/Table/index.vue'
export default {
  name: 'CallPoliceAuthorization',
  components:{
    TableColumn,
    userTree,
    orgTree
  },
  props:{
    tablerow: {
      type:Object,
      default:()=>{}
    }
  },
  data() {
    return {
      isuser: false,
      checklist:[],
      authoritylist: [],
      dialogVisible:false,
      tableConfig: [
        { label: '序号', type:'index' ,center:'center',width:'100'},
        { label: '菜单名称', prop: 'menuName' },
        { label: '授权类型', prop: 'grantType',
          formatter: (row, column, cellValue, index) => {
            return cellValue=='1'?'人员授权':'组织授权'
          }
         },
        { label: '授权对象', prop: 'grantObjectName' },
      ]
    };
  },

  mounted() {
    
  },

  methods: {
    async sure() {
      const orgNo=this.checklist.map(ele=>ele.orgNo).join(',')
      const userNo=this.checklist.map(ele=>ele.userId).join(',')
      this.isuser ? postgrantorganizationapi({ menuId: this.tablerow.menuId, orgNo }).then(res => {
          this.$message({
            type: res.code == '200' ? 'success' : 'waraing',
            message:res.code=='200'?'组织授权成功':res.message
          })
          this.dialogVisible=false
          this.getautlist(this.tablerow)
      }):postgrantuserapi({ menuId: this.tablerow.menuId, userNo }).then(res => {
          this.$message({
            type: res.code == '200' ? 'success' : 'waraing',
            message:res.code=='200'?'人员授权成功':res.message
          })
          this.dialogVisible=false
          this.getautlist(this.tablerow)
      })
    },
    changetype(val) {
      this.checklist=val
    },
    give(val) {
      this.dialogVisible=true
      this.isuser=val
    },
    async getautlist(val) {
      this.$refs.tabledata.loading=true
      const { data: { list: arr } } = await getMenuGrantListapi({ menuId: val.menuId })
      arr.forEach(ele => ele.menuName=this.tablerow.menuName);
      this.authoritylist = arr
      this.$refs.tabledata.loading=false
    },
    async dellist(val) {
      this.$confirm('此操作将删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          deletegrantorganizationapi(val.id).then(res => {
            this.$message({
              type: res.code == '200' ? 'success' : 'waraing',
              message:res.code=='200'?'删除成功':res.message
            })
            this.getautlist(this.tablerow)
          }) 
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    }
  },
};
</script>
<style scoped lang="scss">
.Authorization{
  height: 100%;
  .but{
    margin-bottom: 10px;
  }
  .table{
    height: calc(100% - 42px);
  }
}

</style>